<!DOCTYPE html>
<!--
This is a starter template page. Use this page to start your new project from
scratch. This page gets rid of all links and provides the needed markup only.
-->
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>个人信息</title>
    <!-- Font Awesome Icons -->

    <link rel="stylesheet" href="../../../../plugins/fontawesome-free/css/all.min.css">
    <!-- Theme style -->
    <link rel="stylesheet" href="../../../../dist/css/adminlte.min.css">
    <!-- Google Font: Source Sans Pro -->
    <link rel="stylesheet" href="../../../../plugins/sweetalert2-theme-bootstrap-4/bootstrap-4.min.css">
    <link rel="stylesheet" href="../../plugins/daterangepicker/daterangepicker.css">
    <link href="../../../../dist/css/fonts.css" rel="stylesheet">

</head>

<body class="hold-transition sidebar-mini">
    <div class="wrapper">
        <!-- Navbar -->
        <nav class="main-header navbar navbar-expand navbar-white navbar-light" id="navbar_menu">
            <!-- Left navbar links -->
        </nav>
        <!-- /.navbar -->
        <!-- Main Sidebar Container -->
        <aside class="main-sidebar sidebar-dark-primary elevation-4" id="sidebar_menu">
        </aside>

        <!-- Content Wrapper. Contains page content -->
        <div class="content-wrapper">
            <section class="content-header">
                <div class="container-fluid">
                    <div class="row mb-2">
                        <div class="col-sm-6">
                            <h1>个人信息</h1>
                        </div>
                        <div class="col-sm-6">
                            <ol class="breadcrumb float-sm-right">
                                <li class="breadcrumb-item"><a href="#">主页</a></li>
                                <li class="breadcrumb-item active">个人信息</li>
                            </ol>
                        </div>
                    </div>
                </div><!-- /.container-fluid -->
            </section>
            <div class="content">
                <div class="col-md-12">
                    <div class="card-primary card">
                        <div class="card-header">
                            <h3 class="card-title">个人信息</h3>

                        </div>

                        <div class="row">


                            <div class="col-md-6">
                                <div class="card-body">
                                    <div class="form-group">
                                        <label>学号</label>
                                        <div class="input-group">
                                            <div class="input-group-prepend" style="width:40px;">
                                                <span class="input-group-text"><i class="fas fa-user"></i></span>
                                            </div>
                                            <input type="text" class="form-control" id="id" placeholder="请输入学号"
                                                value="" disabled>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label>姓名</label>
                                        <div class="input-group">
                                            <div class="input-group-prepend" style="width:40px;">
                                                <span class="input-group-text"><i class="fas fa-signature"></i></span>
                                            </div>
                                            <input type="text" class="form-control" id="name" placeholder="请输入姓名"
                                                value="" disabled>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label>专业</label>
                                        <div class="input-group">
                                            <div class="input-group-prepend" style="width:40px;">
                                                <span class="input-group-text"><i class="fas fa-wrench"></i></span>
                                            </div>
                                            <input type="text" class="form-control" id="major" placeholder="请输入专业"
                                                value="">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label>地址</label>
                                        <div class="input-group">
                                            <div class="input-group-prepend" style="width:40px;">
                                                <span class="input-group-text"><i
                                                        class="fas fa-location-arrow"></i></span>
                                            </div>
                                            <input type="text" class="form-control" id="address" placeholder="请输入地址"
                                                value="">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label>生日</label>
                                        <div class="input-group">
                                            <div class="input-group-prepend" style="width:40px;">
                                                <span class="input-group-text"><i
                                                        class="far fa-calendar-alt"></i></span>
                                            </div>
                                            <!-- <input type="text" class="form-control" id="birthday" placeholder="请输入生日"
                                                value=""> -->
                                            <input type="text" class="form-control float-right" id="birthday"
                                                placeholder="请输入生日" value="">
                                        </div>
                                    </div>
                                </div>

                            </div>
                            <div class="col-md-6">

                                <div class="card-body">
                                    <div class="form-group">
                                        <label>QQ</label>
                                        <div class="input-group">
                                            <div class="input-group-prepend" style="width:40px;">
                                                <span class="input-group-text"><i class="fab fa-qq"></i></span>
                                            </div>
                                            <input type="text" class="form-control" id="qq" placeholder="请输入QQ"
                                                value="">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label>邮箱</label>
                                        <div class="input-group">
                                            <div class="input-group-prepend" style="width:40px;">
                                                <span class="input-group-text"><i class="fas fa-at"></i></span>
                                            </div>
                                            <input type="text" class="form-control" id="email" placeholder="请输入邮箱"
                                                value="">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label>电话</label>
                                        <div class="input-group">
                                            <div class="input-group-prepend" style="width:40px;">
                                                <span class="input-group-text"><i class="fas fa-phone"></i></span>
                                            </div>
                                            <input type="text" class="form-control" id="tel" placeholder="请输入电话"
                                                value="">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label>微信</label>
                                        <div class="input-group">
                                            <div class="input-group-prepend" style="width:40px;">
                                                <span class="input-group-text"><i class="fab fa-weixin"></i></span>
                                            </div>
                                            <input type="text" class="form-control" id="weChat" placeholder="请输入微信"
                                                value="">
                                        </div>
                                    </div>
                                    <div class="form-group">

                                        <button type="button" class="btn btn-block btn-primary" id="submit_btn"
                                            style="margin-left:auto;width:100px;margin-top:50px">修改</button>
                                    </div>

                                </div>

                                <!-- /.card-body -->

                                <!-- /.card -->
                                <!-- Widget: user widget style 1 -->
                                <!-- <div class="card card-widget widget-user">
                                        <div class="widget-user-header text-white"
                                            style="background: url('../../../../dist/img/photo1.png') center center;">
                                            <h3 class="widget-user-username text-right">奥利安娜</h3>
                                            <h5 class="widget-user-desc text-right">发条魔灵</h5>
                                        </div>
                                        <div class="widget-user-image">
                                            <img class="img-circle" src="../../../../dist/img/user3-128x128.jpg" alt="User Avatar">
                                        </div>
                                        <div class="card-footer">
                                            <div class="row">
                                                <div class="col-sm-4 border-right">
                                                    <div class="description-block">
                                                        <h5 class="description-header">30</h5>
                                                        <span class="description-text">线上任务</span>
                                                    </div>
                                                </div>
                                                <div class="col-sm-4 border-right">
                                                    <div class="description-block">
                                                        <h5 class="description-header">40</h5>
                                                        <span class="description-text">线下任务</span>
                                                    </div>
                                                </div>
                                                <div class="col-sm-4">
                                                    <div class="description-block">
                                                        <h5 class="description-header">35</h5>
                                                        <span class="description-text">打卡数</span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div> -->
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /.col (left) -->

                <!-- /.col (right) -->
            </div>
            <!-- /.content -->
        </div>
    </div>
    <!-- /.content-wrapper -->
    </div>
    <!-- ./wrapper -->
    <!-- REQUIRED SCRIPTS -->
    <!-- jQuery -->
    <script src="../../../../plugins/jquery/jquery.min.js"></script>
    <script>
        // 引入左边导航栏
        $.get("../../../../bars/Operator/operator_sidebar.html", function (data) {
            // console.log(data)
            $("#sidebar_menu").html(data);
        })
        //引入上边导航栏 
        $.get("../../../../bars/Operator/operator_navbar.html", function (data) {
            $("#navbar_menu").html(data);
        })
    </script>


    <!-- Bootstrap 4 -->
    <script src="../../../../plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
    <!-- AdminLTE App -->
    <script src="../../../../dist/js/adminlte.min.js"></script>
    <!-- InputMask -->
    <!-- Select2 -->
    <script src="../../../../plugins/select2/js/select2.full.min.js"></script>
    <!-- date-range-picker -->
    <script src="../../../../plugins/sweetalert2/sweetalert2.min.js"></script>
    <script src="../../plugins/moment/moment.min.js"></script>
    <script src="../../../../plugins/daterangepicker/daterangepicker.js"></script>
    <script>
        const Toast = Swal.mixin({
            toast: true,
            showConfirmButton: false,
            timer: 1500
        });

        $(function () {
            $.ajax(
                {
                    type: 'POST',
                    url: "/operator/getMyInfo",
                    async: true,
                    dataType: 'Text',
                    crossDomain: true,
                    xhrFields: {
                        withCredentials: true
                    },
                    success: function (res) {
                        console.log(JSON.parse(res))
                        let data = JSON.parse(res)
                        $("#id").attr("value", data.account)
                        $("#name").attr("value", data.name)
                        $("#major").attr("value", data.major)
                        $("#address").attr("value", data.address)
                        $("#birthday").val(data.birthday)
                        $("#qq").attr("value", data.qq)
                        $("#email").attr("value", data.email)
                        $("#tel").attr("value", data.phone)
                        $("#weChat").attr("value", data.weChat)
                    },
                    error: function (err) {
                        console.log(JSON.stringify(err))
                        console.log(err)
                    }
                })
            $('#birthday').daterangepicker({
                timePicker: false,        // 选择时间
                singleDatePicker: true,  // 只选一个
                locale: {
                    format: 'YYYY/MM/DD'
                }
            })
            $("#submit_btn").on("click", function () {
                $.ajax({
                    type: 'POST',
                    url: '/operator/updateMyInfo',
                    async: true,
                    dataType: "Text",
                    data:
                        JSON.stringify({
                            "account": $("#id").val(),
                            "name": $("#name").val(),
                            "major": $("#major").val(),
                            "address": $("#address").val(),
                            "birthday": $("#birthday").val(),
                            "qq": $("#qq").val(),
                            "email": $("#email").val(),
                            "phone": $("#tel").val(),
                            "weChat": $("#weChat").val()
                        }),
                    crossDomain: true,
                    xhrFields: {
                        withCredentials: true
                    },
                    contentType: "application/json;charset=UTF-8",
                    success: function (res) {
                        console.log(res)
                        console.log(res.statusCode);
                        if (JSON.parse(res).statusCode === "200") {
                            Toast.fire({
                                icon: 'success',
                                title: ' 修改成功'
                            })
                            window.location.href = "/operator/personalInfoPage"
                            return false
                        } else {
                            Toast.fire({
                                icon: 'error',
                                title: ' 提交失败 请检查你的数据格式是否正确'
                            })
                            return false
                        }
                    },
                    error: function (err) {
                        console.log(JSON.stringify(err));
                        Toast.fire({
                            icon: 'error',
                            title: ' 提交失败 请检查你的数据格式是否正确'
                        })
                        return false
                    }
                });
            })
        })
    </script>
</body>

</html>